<template>
	<div class="publicformview">
		<el-form :rules='rules' label-width='150px' :inline="true" :model="listQuery" :disabled='blockType==3' size="mini"
			ref="addForm" style="margin-top: 20px;">
			<el-row :gutter="24">
				<el-col :span="6">
					<el-form-item label="归属管片：" prop="blockgroup">
						<el-select v-model="listQuery.blockgroup" filterable>
							<div v-for="(item,index) in guanpianList" :key="index">
								<el-option :disabled='item.status!=0' :label="item.groupnew" :value="item.groupnew"
									:key="index"></el-option>
							</div>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="房屋地址：" prop="address">
						<el-input v-model="listQuery.address"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="是否可售：" prop="issell">
						<el-select v-model="listQuery.issell">
							<el-option label="可售" value="1" key="1"></el-option>
							<el-option label="不可售" value="0" key="0"></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="代码：" prop="creatingdeptno">
						<el-input v-model="listQuery.creatingdeptno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="建档单位：" prop="creatingdept">
						<el-select v-model="listQuery.creatingdept">
							<div v-for="(item,index) in bumenList" :key="index">
								<el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
							</div>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="所号：" prop="blockno">
						<el-input v-model="listQuery.blockno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="类型： " prop="blockmain">
						<el-select v-model="listQuery.blockmain">
							<el-option label="主体" value="主体" key="1"></el-option>
							<el-option label="附属" value="附属" key="0"></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="启始日期：" prop="startdate">
						<el-date-picker disabled v-model="listQuery.startdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="启始原因： " prop="startcause">
						<el-select v-model="listQuery.startcause">
							<div v-for="(item,index) in qishiyuanyingList" :key="index">
								<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
							</div>
						</el-select>
					</el-form-item>
				</el-col>
				<span v-if="blockType==3">
					<el-col :span="6">
						<el-form-item label="终止日期：" prop="stopdate">
							<el-date-picker v-model="listQuery.stopdate" type="date" placeholder="年/月/日">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="6">
						<el-form-item label="终止原因：" prop="stopcause">
							<el-select v-model="listQuery.startcause">
								<div v-for="(item,index) in zhongzhiList" :key="index">
									<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
								</div>
							</el-select>
						</el-form-item>
					</el-col>
				</span>
				<span v-if="blockid">
					<el-col :span="6">
						<el-form-item label="变动日期：" prop="changedate">
							<el-date-picker v-model="listQuery.changedate" type="date" placeholder="年/月/日">
							</el-date-picker>
						</el-form-item>
					</el-col>
					<el-col :span="6">
						<el-form-item label="变动原因：" prop="changecause">
							<el-select v-model="listQuery.changecause">
								<div v-for="(item,index) in biandongList" :key="index">
									<el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
								</div>
							</el-select>
						</el-form-item>
					</el-col>
				</span>
				<el-col :span="6">
					<el-form-item label="管理形式：" prop="manageway">
						<el-select v-model="listQuery.manageway" @change='guanliChange'>
							<div v-for="(item,index) in guanlixingshiList" :key="index">
								<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
							</div>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="产别：" prop="ownway">
						<el-select v-model="listQuery.ownway" :disabled='listQuery.ownway=="直管公产"'>
							<div v-for="(item,index) in chanbieList" :key="index">
								<el-option :label="item.detail" :value="item.detail" :key="index"></el-option>
							</div>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="嘱接部门：" prop="owndept">
						<el-input v-model="listQuery.owndept"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="来文号：" prop="receivefileno1">
						<el-input v-model="listQuery.receivefileno1"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="通知日期：" prop="informdate">
						<el-date-picker v-model="listQuery.informdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="收文号：" prop="receivefileno2">
						<el-input v-model="listQuery.receivefileno2"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="接管日期：" prop="takeoverdate">
						<el-date-picker v-model="listQuery.takeoverdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="原产权人：" prop="originowner">
						<el-input v-model="listQuery.originowner"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="起租日期：" prop="startrentdate">
						<el-date-picker v-model="listQuery.startrentdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6" v-if="blockid">
					<el-form-item label="地号：" prop="fieldno">
						<el-input v-model="listQuery.fieldno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6" v-if="blockid">
					<el-form-item label="土地证号：" prop="fieldidno">
						<el-input disabled v-model="listQuery.fieldidno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6" v-if="blockid">
					<el-form-item label="房产证号：" prop="estateidno">
						<el-input v-model="listQuery.estateidno"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="产权单位：" prop="cqdw">
						<!-- 	<el-select v-model="listQuery.cqdw">
							<div v-for="(item,index) in chanquandanweiList" :key="index">
								<el-option :label="item.classmid" :value="item.classmid" :key="index"></el-option>
							</div>
						</el-select> -->
						<el-input disabled v-model="listQuery.cqdw"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label=" 自来水移交：" prop="watertransfer">
						<el-select v-model="listQuery.watertransfer">
							<el-option label="是" value="是"></el-option>
							<el-option label="否" value="否"></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="移交日期：" prop="watertransferdate">
						<el-date-picker v-model="listQuery.watertransferdate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6">
					<el-form-item label="管理日期：" prop="managedate">
						<el-date-picker v-model="listQuery.managedate" type="date" placeholder="年/月/日">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="接管前历史沿革情况：" prop="beforetakeoverhis" label-width="180px">
						<el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.beforetakeoverhis"
							style="width: 300px">
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="其他产权情况(接管前)：" prop="beforetakeoverotherown" label-width="180px">
						<el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.beforetakeoverotherown"
							style="width: 300px">
						</el-input>

					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="其他产权情况(接管后)：" prop="aftertakeoverotherown" label-width="180px">
						<el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.aftertakeoverotherown"
							style="width: 300px">
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="备注：" prop="blockmemo1" label-width="180px">
						<el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="listQuery.blockmemo1" style="width: 300px">
						</el-input>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<div class="bottomTop" v-if='blockType!=3'>
			<el-button type="primary" size="mini" @click="handleAddUser">保存</el-button>
		</div>
	</div>
</template>

<script>
	import dayjs from 'dayjs'
	import {
		blockGroupList,
		houseAdminList,
		addBlockDetail,
		blockDetail,
		updBlockDetail,
		getBLockNo
	} from '@/api/industry'
	export default {
		props: {
			blockType: String,
			blockid: String
		},
		name: 'canquanqingkuang',
		data() {
			return {
				listQuery: {
					blockgroup: '',
					address: '',
					creatingdeptno: '',
					creatingdept: '',
					blockno: '',
					issell: '',
					blockmain: '',
					startdate: '',
					startrentdate: '',
					startcause: '',
					stopcause: '',
					manageway: '',
					ownway: '',
					owndept: '',
					receivefileno1: '',
					informdate: '',
					fieldno: '',
					receivefileno2: '',
					takeoverdate: '',
					fieldidno: '',
					originowner: '',
					stopdate: '',
					estateidno: '',
					changecause: '',
					changedate: '',
					cqdw: '',
					watertransfer: '',
					watertransferdate: '',
					managedate: '',
					beforetakeoverhis: '',
					beforetakeoverotherown: '',
					aftertakeoverotherown: '',
					blockmemo1: ''
				},
				rules: {
					blockgroup: [{
						required: true,
						message: '请选择归属管片',
						trigger: 'blur'
					}]
					// watertransferdate: [
					// 	{ required: true, message: '请选择移交日期', trigger: 'blur' }
					// ]
				},
				total: 0,
				options: [{
					key: '1'
				}],
				listLoading: false,
				dialogVisible: false,
				// 管片列表
				guanpianList: [],
				chanyeList: [],
				// 建档单位
				bumenList: [],
				// 产别
				chanbieList: [],
				// 启始原因
				qishiyuanyingList: [],
				// 终止原因
				zhongzhiList: [],
				// 变动原因
				biandongList: [],
				// 管理形式
				guanlixingshiList: [],
				// 产权单位
				chanquandanweiList: []
			}
		},

		computed: {},
		watch: {
			'listQuery.ownway': {
				handler(newVal, oldVal) {
					if (newVal == '直管公产') {
						this.listQuery.cqdw = '天津市人民政府'
					} else {
						this.listQuery.cqdw = '代管产'
					}
				}
			}
		},

		mounted() {
			// 遍历字典
			this.chanyeList = JSON.parse(localStorage.getItem('chanye'))
			this.chanyeList.forEach((item, index) => {
				if (item.classname == '建档单位') {
					item.classmidList.forEach((it, idx) => {
						this.bumenList = it.classdetailList
					})
				} else if (item.classname == '档案变动') {
					item.classmidList.forEach((it, idx) => {
						if (it.classmid == '所档案变动') {
							this.biandongList = it.classdetailList
						}
					})
				} else if (item.classname == '产别') {
					item.classmidList.forEach((it, idx) => {
						if (it.classmid == '产别') {
							this.chanbieList = it.classdetailList
						}
					})
				} else if (item.classname == '启始原因') {
					this.qishiyuanyingList = item.classmidList
				} else if (item.classname == '终止原因') {
					this.zhongzhiList = item.classmidList
				} else if (item.classname == '管理形式') {
					this.guanlixingshiList = item.classmidList
				} else if (item.classname == '产权单位') {
					this.chanquandanweiList = item.classmidList
				}
			})

			if (this.blockid) {
				let data = {
					BlockID: this.blockid
				}
				blockDetail(data).then((res) => {
					this.listQuery = res.data
					if (this.listQuery.blockmain == 1) {
						this.listQuery.blockmain = '主体'
					} else {
						this.listQuery.blockmain = '附属'
					}
				})
			} else {
				// 初始化时间
				this.listQuery.startdate = dayjs().format('YYYY-MM-DD HH:mm:ss')
				this.listQuery.changedate = dayjs().format('YYYY-MM-DD HH:mm:ss')
				// getBLockNo().then((res) => {
				//   this.listQuery.blockno = res.data
				this.listQuery.blockno = ''
				// getBLockNo().then((res) => {
				//
			}
			this.blockGroupList()

			if (localStorage.getItem('chanquanqingkuang')) {
				this.listQuery = JSON.parse(localStorage.getItem('chanquanqingkuang'))
			}
		},

		methods: {
			// 管片列表
			blockGroupList() {
				let data = {
					group: '',
					groupNumber: '',
					houseAdmin: '',
					pageNum: '',
					pageSize: 99999
				}
				this.listLoading = true
				blockGroupList(data).then((res) => {
					this.guanpianList = res.data.list
					this.listLoading = false
				})
			},
			resetForm(val) {
				this.$refs[val].resetFields()
			},
			handleAddUser(type) {
				this.$refs.addForm.validate((valid) => {
					if (valid) {
						let data = {
							blockgroup: this.listQuery.blockgroup,
							address: this.listQuery.address,
							creatingdeptno: this.listQuery.creatingdeptno,
							creatingdept: this.listQuery.creatingdept,
							blockno: this.listQuery.blockno,
							issell: this.listQuery.issell,
							blockmain: this.listQuery.blockmain == '主体' ? 1 : 0,
							startdate: this.listQuery.startdate ?
								dayjs(this.listQuery.startdate).format('YYYY-MM-DD HH:mm:ss') : '',
							startrentdate: this.listQuery.startrentdate ?
								dayjs(this.listQuery.startrentdate).format(
									'YYYY-MM-DD HH:mm:ss'
								) : '',
							startcause: this.listQuery.startcause,
							stopcause: this.listQuery.stopcause,
							manageway: this.listQuery.manageway,
							takeoverdate: this.listQuery.takeoverdate ?
								dayjs(this.listQuery.takeoverdate).format('YYYY-MM-DD HH:mm:ss') : '',
							ownway: this.listQuery.ownway,
							owndept: this.listQuery.owndept,
							receivefileno1: this.listQuery.receivefileno1,
							informdate: this.listQuery.informdate ?
								dayjs(this.listQuery.informdate).format('YYYY-MM-DD HH:mm:ss') : '',
							fieldno: this.listQuery.fieldno,
							receivefileno2: this.listQuery.receivefileno2,
							fieldidno: this.listQuery.fieldidno,
							originowner: this.listQuery.originowner,
							stopdate: this.listQuery.stopdate ?
								dayjs(this.listQuery.stopdate).format('YYYY-MM-DD HH:mm:ss') : '',
							estateidno: this.listQuery.estateidno,
							changecause: this.listQuery.changecause,
							changedate: this.listQuery.changedate ?
								dayjs(this.listQuery.changedate).format('YYYY-MM-DD HH:mm:ss') : '',
							cqdw: this.listQuery.cqdw,
							watertransfer: this.listQuery.watertransfer,
							watertransferdate: this.listQuery.watertransferdate ?
								dayjs(this.listQuery.watertransferdate).format(
									'YYYY-MM-DD HH:mm:ss'
								) : '',
							managedate: this.listQuery.managedate ?
								dayjs(this.listQuery.managedate).format('YYYY-MM-DD HH:mm:ss') : '',
							beforetakeoverhis: this.listQuery.beforetakeoverhis,
							beforetakeoverotherown: this.listQuery.beforetakeoverotherown,
							aftertakeoverotherown: this.listQuery.aftertakeoverotherown,
							blockmemo1: this.listQuery.blockmemo1,
							blockid: this.blockid ? this.blockid : -1
						}
						// if(this.listQuery.watertransfer=='是'){
						// 	data.watertransferdate = this.listQuery.watertransferdate?dayjs(this.listQuery.watertransferdate).format('YYYY-MM-DD HH:mm:ss'):''
						// }
						localStorage.setItem('chanquanqingkuang', JSON.stringify(data))
						if (this.blockType == 2 || this.blockType == 4) {
							updBlockDetail(data).then((res) => {
								this.$message(res.message)
								localStorage.setItem('blockid', res.data.blockid)
								this.$router.go(-1)
							})
						} else {
							addBlockDetail(data).then((res) => {
								this.$message(res.message)
								localStorage.setItem('blockid', res.data.blockid)
								this.$router.go(-1)
							})
						}
					} else {
						console.log('验证失败！')
						return false
					}
				})
			},
			returns() {
				this.$router.go(-1)
			},
			// 选择类型
			selectButton(type) {
				this.type = type
			},
			//选择管理形式
			guanliChange(value) {
				this.chanyeList.forEach((item, index) => {
					if (item.classname == '管理形式') {
						item.classmidList.forEach((it, idx) => {
							if (value == '直管' && it.classmid == '直管') {
								this.chanbieList = it.classdetailList
								this.listQuery.ownway = '直管公产'
							} else if (value == '代管' && it.classmid == '代管') {
								this.chanbieList = it.classdetailList
								this.listQuery.ownway = ''
							}
						})
					}
				})
			}
		},
		beforeDestroy() {
			let data = {
				blockgroup: this.listQuery.blockgroup,
				address: this.listQuery.address,
				creatingdeptno: this.listQuery.creatingdeptno,
				creatingdept: this.listQuery.creatingdept,
				blockno: this.listQuery.blockno,
				issell: this.listQuery.issell,
				blockmain: this.listQuery.blockmain,
				startdate: this.listQuery.startdate ?
					dayjs(this.listQuery.startdate).format('YYYY-MM-DD HH:mm:ss') : '',
				startrentdate: this.listQuery.startrentdate ?
					dayjs(this.listQuery.startrentdate).format('YYYY-MM-DD HH:mm:ss') : '',
				startcause: this.listQuery.startcause,
				stopcause: this.listQuery.stopcause,
				manageway: this.listQuery.manageway,
				takeoverdate: this.listQuery.takeoverdate ?
					dayjs(this.listQuery.takeoverdate).format('YYYY-MM-DD HH:mm:ss') : '',
				ownway: this.listQuery.ownway,
				owndept: this.listQuery.owndept,
				receivefileno1: this.listQuery.receivefileno1,
				informdate: this.listQuery.informdate ?
					dayjs(this.listQuery.informdate).format('YYYY-MM-DD HH:mm:ss') : '',
				fieldno: this.listQuery.fieldno,
				receivefileno2: this.listQuery.receivefileno2,
				fieldidno: this.listQuery.fieldidno,
				originowner: this.listQuery.originowner,
				stopdate: this.listQuery.stopdate ?
					dayjs(this.listQuery.stopdate).format('YYYY-MM-DD HH:mm:ss') : '',
				estateidno: this.listQuery.estateidno,
				changecause: this.listQuery.changecause,
				changedate: this.listQuery.changedate ?
					dayjs(this.listQuery.changedate).format('YYYY-MM-DD HH:mm:ss') : '',
				cqdw: this.listQuery.cqdw,
				watertransfer: this.listQuery.watertransfer,
				watertransferdate: this.listQuery.watertransferdate?dayjs(this.listQuery.watertransferdate).format(
					'YYYY-MM-DD HH:mm:ss'
				):'',
				managedate: this.listQuery.managedate ?
					dayjs(this.listQuery.managedate).format('YYYY-MM-DD HH:mm:ss') : '',
				beforetakeoverhis: this.listQuery.beforetakeoverhis,
				beforetakeoverotherown: this.listQuery.beforetakeoverotherown,
				aftertakeoverotherown: this.listQuery.aftertakeoverotherown,
				blockmemo1: this.listQuery.blockmemo1,
				blockid: this.blockid ? this.blockid : -1
			}
			localStorage.setItem('chanquanqingkuang', JSON.stringify(data))
		}
	}
</script>

<style scoped>
	.headTop {
		width: 100%;
		display: flex;
		justify-content: space-between;

		.xinxi {
			display: flex;
			width: 800px;
		}
	}

	.el-form-item {
		justify-content: start !important;
	}

	.el-select {
		width: 180px;
	}

	.el-input {
		width: 180px;
	}

	.el-date-picker {
		width: 180px;
	}

	.bottomTop {
		width: 100%;
		display: flex;
		justify-content: end;
	}

	.tabButton {
		background: #eff2f7;
		color: #333333;
		border: none;
	}

	.tabButton {
		background: #eff2f7;
		color: #333333;
		border: none;
	}

	/deep/ .el-form-item--mini {
		width: unset;
	}
</style>